<template>
    <el-container>
        <el-main>
            <el-upload
                class="upload-demo"
                ref="upload"
                action="/excel/import"
                :on-preview="handlePreview"
                :on-remove="handleRemove"
                :file-list="fileList"
                :before-upload="beforeUpload"
                :auto-upload="false">
                <el-button slot="trigger" size="small" type="primary">选择表格</el-button>
                <el-button style="margin-left: 10px;" size="small" type="success" @click="submitUpload">确认上传</el-button>
                <div slot="tip" class="el-upload__tip">只能上传excell文件</div>
            </el-upload>
        </el-main>   
    </el-container>
         
    
</template>

<script>
   export default {
     
    data() {
      return {
        fileList: [],
        headers:this.$store.state.headers
      };
    },
    methods: {
      beforeUpload(file){
        let url="/excel/import";
        let formData=new FormData();
        formData.append("excel",file)
        if(file.type=="xls"||"xlsx"){
          this.axios.post(url,formData,{
          headers:this.$store.state.headers
        }).then(res=>{
          if(res.data.status==0){
            this.$message({
              message: '上传成功',
              type: 'success'
            })
          }else{
            this.$message(res.data.msg)
          }
        },err=>{
           this.$message(err.data.msg)
        })
        }else{
          this.$message("文件格式只能是xls或者xlsx")
          return false
        }
        
        return false
      },
      submitUpload() {
        this.$refs.upload.submit();
      },
      handleRemove(file, fileList) {
        console.log(file, fileList);
      },
      handlePreview(file) {
        console.log(file);
      }
    }
  }
</script>

<style>

</style>
